<template>
  <div>
    <h1>分类列表</h1>
    <div class="typeList">
      <Item title="图片" >
       <template #default>
         <img src="https://t7.baidu.com/it/u=2341187082,3365503047&fm=193&f=GIF" style="width:100%" alt="">
       </template>
       <template #footer>
          <a href="###">查我点看详情</a>
        </template>
      </Item>
      <Item title="音乐">
        <template #default>
         <ul >
          <li>等你下课</li>
          <li>童话</li>
          <li>秋天的风</li>
        </ul>
        </template>
        <template #footer>
         <button>更多音乐请点击我</button>
        </template>
      </Item>
      <Item title="视频">
        <template #default>
          <video src="./assets/视频.mp4" autoplay muted style="width:100%"></video>
        </template>
        <template #footer>
          <p>好看就点个赞吧</p>
        </template>
      </Item>
    </div>
  </div>
</template>
<script>
import Item from '@/components/Item'
export default {
  name:"App",
  components:{
    Item,
  },
  data(){},
}
</script>
<style scoped>
.typeList {
  display: flex;
  justify-content: space-around;
}
</style>